/**
 * @description  : 搜索详情页面
 * @descriptionDetail : 搜索详情页面
 * @copyright    : 浙江烟草
 * @author       : mc
 * @create       : 2022-11-03 17:36:26
 */
<template>
  <view class="page">
    <!-- #ifdef H5-ONLY -->
    <theme-navbar :isWhite="false" backText="返回" :title="navTitle">
      <view class="nav-right-icon">
        <u-icon name="integral" size="38" color="#FFF" @tap="about"></u-icon>
      </view>
    </theme-navbar>
    <!-- #endif -->
    <view class="content">
      <component :is="componentName" :record="curRecord" :searchKeyUuid="curRecord.uuid" v-if="componentName != ''"></component>
      <view class="center-mc" v-else>
        <u-empty style="width: 100%;" mode="search" text="无数据"></u-empty>
      </view>
    </view>
    <u-popup v-model="aboutShow" mode="right" length="80%">
      <view class="popup-mc-content">
        <theme-navbar :is-white="false" :isBack="false" title="相关推荐">
        </theme-navbar>
        <u-empty style="width: 100%;" v-if="recommend.length ==0" mode="search" text="无数据"></u-empty>
        <scroll-view v-else scroll-y="true" :style="{height: pmHeight + 'px',}">
          <view class="pm-content" :style="{height: pmHeight + 'px',}">
            <u-collapse :head-style="headStyle">
              <u-collapse-item :open="item.open" :index="index" v-for="(item, index) in recommend" :key="'uci'+index" @change="itemChange" :title="item.typeName">
                <view class="collapse-item" hover-stay-time="150" hover-class="u-cell-hover">
                  <view class="collapse-row" v-for="(rd,idx) in item.children" :key="'ucic'+idx" @click="detail(rd)">
                    <view class="cr one">
                      {{ rd.title }}
                    </view>
                    <view class="cr two">
                      {{ rd.content }}
                    </view>
                    <view class="cr three">
                      关联节点：{{ rd.route }}
                    </view>
                  </view>
                </view>
              </u-collapse-item>
            </u-collapse>
          </view>
        </scroll-view>
      </view>
    </u-popup>
  </view>
</template>

<script>
import analysisService from "@/service/infoAnalysis/info.analysis.service.js";
import railroadTransportArchive from "@/pages/intelligence/intelligenceFilesInfo/railroadtransportArchive.vue";
import waterwaytransportArchive from "@/pages/intelligence/intelligenceFilesInfo/waterwaytransportArchive.vue";
import expressArchive from "@/pages/intelligence/intelligenceFilesInfo/expressArchive.vue";
import roadtransportArchive from "@/pages/intelligence/intelligenceFilesInfo/roadtransportArchive.vue";
import airtransportArchive from "@/pages/intelligence/intelligenceFilesInfo/airtransportArchive.vue";
import logisticsArchive from "@/pages/intelligence/intelligenceFilesInfo/logisticsArchive.vue";
import personsInvolved from "@/pages/intelligence/intelligenceFilesInfo/personsInvolved.vue";
import caseInfo from "@/pages/case/offline/caseInfo.vue";
import licInfo from "@/pages/retailer/retailerInfo/retailerInfo.vue";
export default{
  components:{
    "train" :railroadTransportArchive,
    "ship": waterwaytransportArchive,
    "express": expressArchive,
    "car": roadtransportArchive, 
    "plane": airtransportArchive,
    "logistics": logisticsArchive,
    "person": personsInvolved,
    "caseInfo":caseInfo,
    "licInfo": licInfo,
  },
  onLoad(op) {
    this.showDefaultTitle = false;
    let rParam = this.getRouteParam() || {};
    this.searchItm = this.$u.deepClone(rParam);
    this.type = this.searchItm.type;
    this.detail(this.searchItm);
  },
  data(){
    return {
      searchItm:{},
      curRecord:{},
      type:"",
      componentName:"",
      aboutShow:false, // 相关推荐展示
      pmHeight:300,
      headStyle:{
        backgroundColor:"#f5f5f5",
        paddingLeft: this.$theme.cm_content_paddng_row,
        paddingRight: this.$theme.cm_content_paddng_row,
      },
      recommend:[],
    };
  },
  mounted() {
    this.init();
  },
  methods:{
    init(){
      this.pmHeight = this.$u.sys().windowHeight - 44;
    },
    archiveInfoByWord(record){
      if(!record) return;
      this.aboutShow = false;
      if(record.type === 'case'){
        this.curRecord = record;
        this.updateMixinTitle('案件信息');
        this.setRouteParam({
          caseUuid:record.uuid, // 
          from : "searchKey",
        });
        this.componentName = "caseInfo";
        return;
      }else if(record.type === 'lic') {
        this.updateMixinTitle('证件信息');
        this.curRecord = record;
        this.componentName = "licInfo";
        return;
      }
      this.$modal.showLoading('加载中...');
      analysisService.getArchiveInfoByWord({type: record.type,uuid: record.uuid, keywords: record.key,}).then(res => {
        this.$modal.hideLoading();
        let rRecord = res.bean;
        if(rRecord == undefined){
          this.$u.toast('空数据');
          return;
        }
        rRecord.key = record.key;
        if(record.type == 'person'){
          this.updateMixinTitle((record.indexName || record.typeName) + '信息')
        }else{
          this.updateMixinTitle(record.typeName + '信息')
        }
        this.curRecord = rRecord || {};
        this.type = this.curRecord.type;
        this.componentName = record.type;
      }).catch(e => {
        this.$modal.hideLoading();
        this.componentName = "";
        console.log(e);
      });
    },
    about(){
      this.aboutShow = true;
    },
    itemChange(e){
		
    },
    detail(record){
      this.archiveInfoByWord(record);
      analysisService.recommend({ type: record.type, key: record.key, }).then(res => {
        if(res.success){
          let bean = res.bean;
          let main =  bean.mainContent || {};
          main.mapping = main.mapping  || {};
          main.main = main.main  || {};
          let items = res.bean.items || [];
          let types = [];
          items.forEach(r => {
            let cTypes = types.filter(z => z.type === r.type);
            let item = cTypes.length > 0 ? cTypes[0] : { children: [], };
            item.type = r.type;
            if(item.type == this.type){
              item.open = true;
            }else{
              item.open = false;
            }
            item.typeName = r.typeName;
            item.children.push(r);
            if (cTypes.length === 0) {
              types.push(item);
            }
          });
          this.recommend = types;
        }else{
          this.$u.toast(res.msg);
        }
      }).catch(e => {
        console.log(e);
      });
    },
  },
}
</script>

<style scoped lang="scss">
	.nav-right-icon{
		margin-right: 30rpx;
		font-size: .8rem;
		color: #FFF;
	}
	.page{
		padding: 0;
	}
	.content{
		height: 100%;
	}
	.center-mc{
		width: 100%;
		height: 100%;
		display: flex;
		flex-direction: row;
		align-items: center;
	}
	.popup-mc-content{
		width: 100%;
		height: calc(100vh - 44px);
	}
	.pm-content{
		
	}
	
	.collapse-item{
		padding:$cm-conent-padding-column $cm-content-paddng-row;
		border-bottom: 1px solid $cm-gap-color;
	}
	.cr{
		font-size: $cm-form-item-label-font-size;
		color: $cm-form-item-label-color;
	}
	.one{
		color: $u-type-primary !important;
		font-weight: 500;
		font-size: $cm-form-right-icon-size;
	}
	.cr:nth-child(even){
		margin-top: 20rpx;
		margin-bottom: 20rpx;
	}
</style>